<template>
  <div class="main">
    <el-row>
      <el-col :span="4" class="menu-col">
        <el-row class="index">
          <el-menu
            default-active="1"
            class="el-menu-vertical-demo taskMenu"
            @open="handleOpen"
            text-color="#000000"
            @close="handleClose">
            <el-submenu index="1">
              <template slot="title">
                <i class="el-icon-user"></i>
                <span>检查列表</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="1-1" @click="clickExamTask">
                  <span>检查任务</span>
                </el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="2">
              <template slot="title">
                <i class="el-icon-s-custom"></i>
                <span>医生管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="2-1">个人信息</el-menu-item>
              </el-menu-item-group>
            </el-submenu>
            <el-submenu index="3">
              <template slot="title">
                <i class="el-icon-s-operation"></i>
                <span>基础管理</span>
              </template>
              <el-menu-item-group>
                <el-menu-item index="3-1">用户管理</el-menu-item>
                <el-menu-item index="3-1">角色管理</el-menu-item>
                <el-menu-item index="3-1">权限管理</el-menu-item>
              </el-menu-item-group>
            </el-submenu>

          </el-menu>
        </el-row>
      </el-col>
      <el-col :span="20" :offset="offsetVale">
        <el-row class="mainWrapt" ref="topNavigation">
          <router-view></router-view>
        </el-row>

      </el-col>
    </el-row>
  </div>

</template>

<script>

  import Cookies from "js-cookie";

  export default {
    name: "index",
    data() {
      return {
        offsetVale: 0,
        user: {},
        agree: '',
        codeUrl: "",
        cookiePassword: "",
        loginForm: {
          username: "admin@163.com",
          password: "admin123",
          rememberMe: false,
          code: "",
          uuid: ""
        },
        loading: false,
        redirect: undefined
      };
    },
    watch: {

    },
    created() {
      this.getCookie();
    },
    methods: {
      clickExamTask(){
        //直接跳转
        this.$router.push('/center/biochemistry');
      },
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      },
      getCookie() {
        const username = Cookies.get("username");
        const password = Cookies.get("password");
        const rememberMe = Cookies.get('rememberMe')
        this.loginForm = {
          username: username === undefined ? this.loginForm.username : username,
          password: password === undefined ? this.loginForm.password : password,
          rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
        };
      },
    },
    mounted(){
      // 自动创建页面高度
      let availHeight = window.screen.availHeight;
      document.getElementsByClassName("index")[0].style.height = (availHeight-200)+"px";
      document.getElementsByClassName("mainWrapt")[0].style.height = (availHeight-200)+"px";
    }
  };
</script>

<style scoped>
  .menu-col{
    padding: 0px;
    margin: 0px;
  }
  .mainWrapt{
   overflow-y: hidden;
  }
  .taskMenu{
    width: 100%;
    padding: 0px;
    margin: 0px;
  }
  .taskMenu .el-row{
    margin: 0px!important;
    padding: 0px!important;
  }
  .taskMenu .el-col{
    padding: 0px!important;
    margin: 0px!important;
  }
  .index {
   /* display: flex;
    justify-content: center;
    align-items: center;*/
    height: 560px;
    /*background-image: url("../assets/images/index-background.jpg");*/
    background-size: cover;
    /*border: 1px solid #D4D4D4;*/
    width: 100%;
    padding: 0px 10px;
    overflow-y: auto;
  }

</style>
